/*
 * @Author: 别拿暗恋当饭吃. 13466071+lililkli@user.noreply.gitee.com
 * @Date: 2024-06-21 14:11:22
 * @LastEditors: 别拿暗恋当饭吃. 13466071+lililkli@user.noreply.gitee.com
 * @LastEditTime: 2024-06-25 15:57:51
 * @FilePath: \react项目框架\sx_demo2\src\pages\My\my.tsx
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 */
import React from "react";
import { Button, NavBar, Toast, List, Switch, Image } from 'antd-mobile'
// import { DemoBlock } from 'demos'
import {
    SearchOutline, MoreOutline, CloseOutline, UnorderedListOutline,
    PayCircleOutline,
    SetOutline,
} from 'antd-mobile-icons'
import { useNavigate } from "react-router-dom";
import icon1 from '../../assets/icon/common_nav_message_white_n.png';
import img1 from '../../assets/otolaryngology.png'
import img2 from '../../assets/psychiatry.png'
import img3 from '../../assets/icon/my_icon_file_n.png'
import img4 from '../../assets/icon/my_icon_wallet_n.png'
import img5 from '../../assets/icon/common_button_collection_large_n.png'
import img6 from '../../assets/icon/my_icon_advice_n.png'
import img7 from '../../assets/icon/my_icon_video_n.png'
import img8 from '../../assets/icon/my_icon_circle_n.png'
import img9 from '../../assets/icon/common_icon_attention_small_n.png'
import img10 from '../../assets/icon/my_icon_task_n.png'
import img11 from '../../assets/icon/my_icon_set_n.png'
import './My.css'
const index = () => {
    const navigate = useNavigate()
    const back = () =>
        Toast.show({
            content: '点击了返回区域',
            duration: 1000,
        })

    const My = () => {
        navigate("/MyArchives")
    }
    const Myconcern = () => {
        navigate("/Myconcern")
    }

    const Mytask =() =>{
        navigate('/Mytask')
    }
    return (
        <div className="box">
            {/* 头部 */}
            <header>
                <nav>
                    <NavBar onBack={back}></NavBar>
                    <img src={icon1} alt="" />
                </nav>
                <div className="avatar">
                    <div>
                        <img src="https://ts3.cn.mm.bing.net/th?id=OIP-C.RAIpWoAL9Ud0IoQ1uOpMAQHaHa&w=250&h=250&c=8&rs=1&qlt=90&o=6&pid=3.1&rm=2" alt="" />
                        <p>欧若拉</p>
                    </div>
                    <Button>签到</Button>
                </div>
            </header>
            {/* 中间 */}
            <main>
                <p>我的问诊</p>
                <div>&emsp;</div>
                <List.Item prefix={
                    <div>
                        <img src={img1} alt="" className="img" />
                    </div>
                } onClick={() => { }}>
                    当前问诊
                </List.Item>
                <div>&emsp;</div>
                <List.Item prefix={
                    <div>
                        <img src={img2} alt="" className="img" />
                    </div>
                } onClick={() => { }}>
                    历史记录
                </List.Item>
            </main>
            <div className="footer">
                <ul>
                    <li onClick={() => My() }>
                        <img src={img3} alt="" />
                        <p>我的档案</p>
                    </li>
                    <li>
                        <img src={img4} alt="" />
                        <p>我的钱包</p>
                    </li>
                    <li>
                        <img src={img5} alt="" />
                        <p>我的收藏</p>
                    </li>
                    <li>
                        <img src={img6} alt="" />
                        <p>被采纳建议</p>
                    </li>
                    <li>
                        <img src={img7} alt="" />
                        <p>我的视频</p>
                    </li>
                    <li>
                        <img src={img8} alt="" />
                        <p>我的病友圈</p>
                    </li>
                    <li onClick={()=>Myconcern()}>
                        <img src={img9} alt="" />
                        <p>我的关注</p>
                    </li>
                    <li onClick={()=>Mytask()}>
                        <img src={img10} alt="" />
                        <p>我的任务</p>
                    </li>
                    <li>
                        <img src={img11} alt="" />
                        <p>设置管理</p>
                    </li>
                </ul>
            </div>
        </div>
    )
}

export default index